<template>
	<view>
		<!-- 分享按钮 -->
		<zan-actionsheet :show="share.show" :actions="share.actions" :cancel-text="share.cancelText"
			:cancel-with-mask="share.cancelWithMask" @cancel="onCloseShare" @actionclick="onClickShareItem"
			mask-class="tiny" />

		<!-- 分享海报 弹出层 -->
		<share-poster v-model="share.showPopup" :id="goodsId"></share-poster>
	</view>
</template>

<script>
	import zanActionsheet from "@/components/actionsheet/index";
	import sharePoster from "./sharePoster";
	export default {
		name: "actionSharePoster",
		model: {
			prop: 'isShow',
			event: 'openShareActionsheet'
		},
		props: {
			isShow: {
				type: Boolean,
				default: false
			},
			goodsId: {
				default: ''
			}

		},
		watch: {
			isShow(val) {
				this.$set(this.share, 'show', val);
			}
		},
		components: {
			zanActionsheet,
			sharePoster,
		},
		data() {
			return {
				// 分享按钮组件
				share: {
					show: false,
					cancelWithMask: true,
					cancelText: '关闭',
					actions: [{
							name: '生成商品海报',
							className: 'action-class',
							loading: false
						},
						// #ifdef MP
						{
							name: '发送给朋友',
							openType: 'share'
						}
						// #endif
					],
					// 商品海报
					showPopup: false,
				}
			};
		},
		methods: {

			/**
			 * 关闭分享选项
			 */
			onCloseShare() {
				this.$emit('openShareActionsheet', false);
			},

			/**
			 * 点击生成商品海报
			 */
			onClickShareItem(e) {

				if (e.detail.index === 0) {
					// 显示商品海报
					this.setData({
						"share.showPopup": true
					});
				}

				this.onCloseShare();
			}
		}
	}
</script>
